<template name="CreateDiscussion">

	<section class="create-channel">
		<div class="create-channel__wrapper">
			<p class="create-channel__description">{{_ "Discussion_description"}}</p>
			<form id="create-discussion" class="create-channel__content">
				{{#unless disabled}}
				{{> SearchCreateDiscussion
					onClickTag=onClickTagRoom
					deleteLastItem=deleteLastItemRoom
					list=selectedRoom
					onSelect=onSelectRoom
					collection=roomCollection
					field='name'
					sort='name'
					label="Discussion_target_channel"
					placeholder="Discussion_target_channel_description"
					name="parentChannel"
					disabled=disabled
					selector=roomSelector
					description=targetChannelText
					noMatchTemplate="roomSearchEmpty"
					templateItem="popupList_item_channel"
					modifier=roomModifier
				}} {{else}}
					<div class="rc-input" disabled>
						<label class="rc-input__label">
							<div class="rc-input__title">{{_ "Discussion_target_channel"}}</div>
							<div class="rc-input__wrapper">
								<input disabled name="parentChannel" id="parentChannel" value={{parentChannel}} class="rc-input__element" />
							</div>
						</label>
					</div>
				{{/unless}}

				<div class="create-channel__inputs">
					<div class="rc-input">
						<label class="rc-input__label">
							<div class="rc-input__title">{{_ "Discussion_name"}}</div>
							<div class="rc-input__wrapper">
								<div class="rc-input__icon">
									{{> icon block="rc-input__icon-svg" icon="discussion"}}
								</div>
								<input name="discussion_name" id="discussion_name" class="rc-input__element" placeholder="{{_ 'New_discussion_name'}}"
									maxlength="{{maxMessageLength}}" value="{{nameSuggestion}}"/>
							</div>
						</label>
					</div>
					{{> SearchCreateDiscussion
						onClickTag=onClickTagUser
						deleteLastItem=deleteLastItemUser
						list=selectedUsers
						onSelect=onSelectUser
						collection='UserAndRoom'
						endpoint='users.autocomplete'
						field='username'
						sort='username'
						label="Invite_Users"
						placeholder="Username_Placeholder"
						name="users"
						icon="at"
						noMatchTemplate="userSearchEmpty"
						templateItem="popupList_item_default"
						modifier=userModifier
					}}
					<div class="rc-input">
						<label class="rc-input__label">
							<div class="rc-input__title">{{_ "Discussion_first_message_title"}}</div>
							<div class="rc-input__wrapper">
								<textarea rows="5" name="discussion_message" id="discussion_message" class="rc-input__element" placeholder="{{_ 'New_discussion_first_message'}}"
									maxlength="{{maxMessageLength}}"></textarea>
							</div>
						</label>
					</div>
				</div>
			</form>
			<div class="rc-input">
				<button form="create-discussion" class="rc-button rc-button--primary js-save-discussion {{createIsDisabled}}" {{createIsDisabled}}>{{_ " Create "}}</button>
			</div>
		</div>
	</section>
</template>

<template name="SearchCreateDiscussion">
	<div class="rc-input" id='search-{{name}}' {{disabled}}>
		<label class="rc-input__label">
			<div class="rc-input__title">{{_ label}}</div>
			<div class="rc-input__wrapper">
				{{# if icon}}
				<div class="rc-input__icon">
					{{> icon block="rc-input__icon-svg" icon=icon}}
				</div>
				{{/if}}
				<div class="rc-tags{{# unless icon}} rc-tags--no-icon{{/unless}}">
					{{#each item in list}} {{> tag item}} {{/each}}
					<input type="text" id="{{name}}" class="rc-tags__input" placeholder="{{_ placeholder}}" name="{{name}}" autocomplete="off" {{disabled}} />
				</div>
			</div>
			{{#with config}}
				{{#if autocomplete 'isShowing'}}
					{{> popupList data=config items=items ready=(autocomplete 'isLoaded')}}
				{{/if}}
			{{/with}}
		</label>
		<div class="rc-input__description">{{ description }}</div>
	</div>
</template>
